<template>
  <section class="category-select-box" v-loading="isLoading">
    <el-row>
      <el-button :label="category.name" v-for="(category,cIndex) in categoryList" :key="cIndex" @click="onTabClick(category)">{{category.name}}</el-button>
    </el-row>
  </section>
</template>

<script>
import { getAllSubCategoryList} from "../../../api/book";

  export default {
    name:"SelectCategory",
    data(){
      return{
        isLoading:false,
        categoryList:[],
      }
    },
    methods:{
      onTabClick(category){
        this.$emit("save",category);
      },
      async loadBookCategory(){
        this.isLoading = true;
        this.categoryList = [];
        let resp = await getAllSubCategoryList();
        if(this.qUtil.validResp(resp)){
          this.categoryList = resp.data.dataList;
        }else this.$message({ message: resp.msg, type: 'warning' });
        this.isLoading = false;
      },
    },
    mounted(){
      this.loadBookCategory();
    }
  }
</script>

<style scoped>
  .category-select-box{
  }

</style>
